<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>briup-电子商务-商品详情</title>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/style.css">

    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/estore.js"></script>
    <script type="text/javascript" src="js/tongji.js"></script>

</head>
<body>
<a href="#top" alt="回到顶部" class="toTop">
    <button class="btn btn-top"><span class="glyphicon glyphicon-chevron-up"></span></button>
</a>
<div class="top" id="top">
    <div class="herf" th:if="${session.user} ==null">
        <span><a th:href="toLogin" href="login.html">登录</a></span>
        <span><a th:href="toRegister" href="register.html">注册</a></span>
    </div>
    <div class="herf" th:if="${session.user} !=null">
        <span><a href="index.html" th:href="toIndex">首页</a></span>
        <span>欢迎<a th:text="${session.user.loginName}" style="color: red;">李四</a></span>
        <span><a href="order.html" th:href="toOrder">我的订单</a></span>
        <span><a href="collect.html" th:href="toCollect">我的收藏</a></span>
        <span><a href="login.html" th:href="exit">退出</a></span>
    </div>
</div>

<div class="head">
    <div class="row clearfix">
        <div class="col-md-3 column">
            <img src="images/logo.png" class="logo">
        </div>
        <div class="col-md-6 column">
            <div class="input-group search">
                <input type="text" class="form-control" id="searchShopName" placeholder="请输入你要检索的书名"
                       style="padding: 20px">
                <span class="input-group-btn">
						<button class="btn btn-search" type="button" onclick="searchShop()"><span
                                class="glyphicon glyphicon-search"></span></button>
					</span>
            </div>
        </div>
        <div class="col-md-3 column bag">
            <a href="shopCar.html" th:href="toShopCar">
                <button class="btn btn-estore">
                    <span class="glyphicon glyphicon-shopping-cart"></span>&nbsp;购物车
                </button>
            </a>
        </div>
    </div>
</div>
<input id="shopId" class="hide" th:value="${shop.id}">
<div class="nav">
    <div class="col-md-2 column  type" data-toggle="collapse"
         href="#typeMenu">全部分类
    </div>

</div>
<div class="body">
    <div class="type-box row clearfix collapse on " id="typeMenu">

        <dl th:each="category : ${application.categories}">
            <dt th:text="${category.name}">文学类:</dt>
            <dd th:each="scategory: ${category.categories}"><a href="" th:href="'toList?categoryId='+${scategory.id}"
                                                               th:text="${scategory.name}">文学类二级标题</a></dd>
        </dl>
    </div>
    <div class="row clearfix">
        <ul class="breadcrumb">
            <li>
                <a href="index.html" th:href="toIndex">首页</a>
            </li>
            <li>
                商品详情
            </li>
            <li class="active" th:text="${shop.name}">
                javaEE 轻量级框架
            </li>
        </ul>
    </div>
    <div class="viewbook row">

        <div class="col-md-5 column pic">
            <div class="big-image row">
                <img class="img-thumbnail" src="images/book_view/book1.jpg"
                     th:src="${application.path}+'/goods/'+${shop.img}">
            </div>
            <div class="row small-image">
                <div class="col-sm-6 col-md-3">
                    <img class="img-thumbnail hover" src="images/book_view/book1.jpg"
                         th:src="${application.path}+'/goods/'+${shop.img}">

                </div>
                <div class="col-sm-6 col-md-3">
                    <img class="img-thumbnail" src="images/book_view/book1.jpg"
                         th:src="${application.path}+'/goods/'+${shop.img}">

                </div>
                <div class="col-sm-6 col-md-3">
                    <img class="img-thumbnail" src="images/book_view/book1.jpg"
                         th:src="${application.path}+'/goods/'+${shop.img}">

                </div>
                <div class="col-sm-6 col-md-3">
                    <img class="img-thumbnail" src="images/book_view/book1.jpg"
                         th:src="${application.path}+'/goods/'+${shop.img}">

                </div>
            </div>

        </div>

        <div class="col-md-7 column book-message">
            <div class="row bookname">
                <label class="col-md-3 column">商品名：</label>
                <span th:text="${shop.name}">javaEE 轻量级框架</span>
            </div>
            <div th:if="${shop.discount}" class="price ">
                <p class="row">
                    <label class="col-md-3 column">原价：</label>
                    <span th:text="${shop.sellingPrice}" class="sellPrice">125.9</span>
                </p>
                <p class="row">
                    <label class="col-md-3 column">杰普价：</label>
                    <span th:text="${shop.discountPrice}" class="discountPrice">125.9</span>
                </p>

            </div>
            <div class="row">
                <label class="col-md-3 column">商家：</label>
                <span th:text="${shop.store}">125.9</span>
            </div>
            <div class="row">
                <label class="col-md-3 column">商品信息：</label>
                <span th:text="${shop.info}">125.9</span>
            </div>
            <div class="row">
                <label class="col-md-3 column">成交量：</label>
                <span th:text="${shop.salesVolume}">125.9</span>
            </div>

            <div class="row  book-price" th:if="${!shop.discount}">
                <label class="col-md-3 column">价格：</label>
                <span th:text="${shop.sellingPrice}" class="book-price">125.9</span>
            </div>
            <div class="row">
                <label class="col-md-3 column">服务：</label>
                <img src="images/icons/service_03.png">
                <small>分期付款</small>
                <img src="images/icons/service_05.png">
                <small>免运费</small>
                <img src="images/icons/service_07.png">
                <small>送货上门</small>
                <img src="images/icons/service_09.png">
                <small>7天无理由退换</small>
            </div>
            <hr>
            <div class="row">
                <div id="box">
                    <dl>
                        <dt class="col-md-3 column">包装：</dt>
                        <dd class="active">简单装</dd>
                        <dd>升级装</dd>
                        <dd>精品装</dd>
                        <dd>至尊装</dd>
                    </dl>
                </div>
            </div>
            <div class="row">
                <a href="#">
                    <button class="col-md-3 column btn btn-estore" th:onclick="'addShopCar('+${shop.id}+')'">加入购物车
                    </button>
                </a>


                <p class="col-md-1 column"></p>
                <button id="collect-btn" class="col-md-3 column btn btn-shopCar"
                        th:onclick="'collect('+${session.user.id}+','+${shop.id}+')'">
                    收藏
                </button>
            </div>
        </div>

    </div>

    <div class="row viewbook">
        <h3>商品详情</h3>
        <p th:utext="${shop.intro}">

        </p>
    </div>
    <div class="m m-content guarantee" id="guarantee">
        <div class="mt">
            <h3>售后保障</h3>
        </div>
        <div class="mc">
            <div class="item-detail item-detail-copyright">
                <div class="serve-agree-bd">
                    <dl>
                        <dt>
                            <i class="goods"></i>
                            <strong>卖家服务</strong>
                        </dt>
                        <dd>
                            <div id="zhibaoqi" class="zbxx">
                            </div>
                            <br/>
                            三年质保（屏保一年、配件三年）<br/></dd>
                        <dt>
                            <i class="goods"></i>
                            <strong>杰普承诺</strong>
                        </dt>
                        <dd>
                            杰普平台卖家销售并发货的商品，由平台卖家提供发票和相应的售后服务。请您放心购买！<br/>
                            注：因厂家会在没有任何提前通知的情况下更改产品包装、产地或者一些附件，本司不能确保客户收到的货物与商城图片、产地、附件说明完全一致。只能确保为原厂正货！并且保证与当时市场上同样主流新品一致。若本商城没有及时更新，请大家谅解！
                        </dd>
                        <dt>
                            <i class="goods"></i><strong>
                            正品行货 </strong>
                        </dt>
                        <dd>杰普商城向您保证所售商品均为正品行货，杰普自营商品开具机打发票或电子发票。</dd>
                    </dl>
                </div>
            </div>
        </div>
        <div id="state">
            <strong>权利声明：</strong><br/>杰普上的所有商品信息、客户评价、商品咨询、网友讨论等内容，是杰普重要的经营资源，未经许可，禁止非法转载使用。
            <p><b>注：</b>本站商品信息均来自于合作方，其真实性、准确性和合法性由信息拥有者（合作方）负责。本站不提供任何保证，并不承担任何法律责任。</p>
            <br/>
            <strong>价格说明：</strong><br/>
            <p><b>杰普价：</b>杰普价为商品的销售价，是您最终决定是否购买商品的依据。</p>
            <p><b>划线价：</b>商品展示的划横线价格为参考价，并非原价，该价格可能是品牌专柜标价、商品吊牌价或由品牌供应商提供的正品零售价（如厂商指导价、建议零售价等）或其他真实有依据的价格；由于地区、时间的差异性和市场行情波动，品牌专柜标价、商品吊牌价等可能会与您购物时展示的不一致，该价格仅供您参考。
            </p>
            <p><b>折扣：</b>如无特殊说明，折扣指销售商在原价、或划线价（如品牌专柜标价、商品吊牌价、厂商指导价、厂商建议零售价）等某一价格基础上计算出的优惠比例或优惠金额；如有疑问，您可在购买前联系销售商进行咨询。
            </p>
            <p><b>异常问题：</b>商品促销信息以商品详情页“促销”栏中的信息为准；商品的具体售价以订单结算页价格为准；如您发现活动商品售价或促销信息有异常，建议购买前先联系销售商咨询。</p>

            <br/>
            <strong>能效标识说明：</strong><br/>
            <p>
                根据国家相关能效标识法规和标准的要求，杰普自营在售商品的能效标识图样，将会逐步替换为新版能源效率标识贴；受能效标识标准变化影响，部分产品的新版和旧版能效标识，在能效等级、测试值等方面会有差异，但产品实际性能完全一样，并不影响购买和使用，加贴新版或旧版能效标识的商品会随机发放，请您放心购买；如有疑问，请在购买前通过咚咚或来电咨询。</p>
        </div>
    </div>
    <div class="footer">
        <div class="row clearfix icons">
            <div class="col-md-3 column">
                <img src="images/icons/icon_1_17.png">
                品目繁多 愉悦购物
            </div>
            <div class="col-md-3 column">
                <img src="images/icons/icon_1_20.png">
                正品保障 天天低价
            </div>
            <div class="col-md-3 column">
                <img src="images/icons/icon_1_23.png">
                极速物流 特色定制
            </div>
            <div class="col-md-3 column">
                <img src="images/icons/icon_1_25.png">
                优质服务 以客为尊
            </div>
        </div>
        <div class="links">
            <p>
                <span>关于我们</span>|
                <span>联系我们</span>|
                <span>加我我们</span>|
                <span>友情链接</span>
            </p>
            <p>沪ICP备14033591号-8 杰普briup.com版权所有 杰普软件科技有限公司</p>
        </div>
    </div>
</div>
</body>

</html>
<script type="text/javascript">
    $(function () {
        const shopId = $('#shopId').val();
        const btn = $('#collect-btn');
        $.ajax({
                url: "findCollect?shopId=" + shopId,
                type: 'get',
                success: function (data) {
                    if (data) {
                        btn.hide()
                    }
                }
            }
        );

    })

    function collect(userId, shopId) {
        const btn = $('#collect-btn')
        console.log(btn)
        $.ajax({
            type: 'get',
            url: userId + '/addCollect?shopId=' + shopId,
            success: function (data) {
                btn.hide()
                alert("收藏成功")

            },
            error: function () {
                alert("收藏失败")
            },
        })

    }
</script>